<!-- 绑定记录 -->
<template>
	<view class="tab-container bg-white">

		<scroll-view scroll-x class="bg-white nav">
			<view class="flex text-center">
				<view class="cu-item flex-sub" :class="active==0?'text-green cur':''" @tap="tabSelect(0)">
					审核已通过
				</view>
				<view class="cu-item flex-sub" :class="active==1?'text-green cur':''" @tap="tabSelect(1)">
					审核未通过
				</view>
			</view>
		</scroll-view>

		<view class="cu-list menu" v-if="active == 0">
			<view class="cu-item arrow" v-if="rooms.length > 0" v-for="(item, key) in rooms" :key="key"
				:data-item="item" @click="myHouseDetail(item)">
				<view class="content padding-tb-sm">
					<view>
						<text class="cuIcon-homefill text-green margin-right-xs"></text>
						{{plotCommunityName}}小区
					</view>
					<view class="text-gray text-sm">
						<text class="cuIcon-right margin-right-xs">房屋编号</text> {{item.houseName}}
					</view>
					<view class="text-gray text-sm">
						<text class="cuIcon-right margin-right-xs">房屋状态</text> {{item.houseStatus}}
					</view>
					<view class="text-gray text-sm">
						<text class="cuIcon-right margin-right-xs">房屋类型</text> {{item.houseType}}
					</view>
					<view class="text-gray text-sm">
						<text class="cuIcon-right margin-right-xs">建筑面积</text> {{item.buildingArea}}
					</view>
				</view>
				<view class="action">
					<view class="">
						
					</view>
				</view>
			</view>

			<view class="cu-item" v-if="rooms.length === 0">
				<view class="content">
					<text class="cuIcon-warn text-green"></text>
					<text class="text-grey">暂无绑定记录</text>
				</view>
				<view class="action">

				</view>
			</view>
		</view>

		<view class="cu-list menu" v-if="active == 1">
			<view class="cu-item arrow" v-if="roomsFills.length > 0" v-for="(item, key) in roomsFills" :key="key"
				:data-item="item" @click="myHouseDetail(item)">
				<view class="content padding-tb-sm">
					<view>
						<text class="cuIcon-homefill text-green margin-right-xs"></text>
						{{plotCommunityName}}小区
					</view>
					<view class="text-gray text-sm">
						<text class="cuIcon-right margin-right-xs">房屋编号</text> {{item.houseName}}
					</view>
					<view class="text-gray text-sm">
						<text class="cuIcon-right margin-right-xs">房屋状态</text> {{item.houseStatus}}
					</view>
					<view class="text-gray text-sm">
						<text class="cuIcon-right margin-right-xs">房屋类型</text> {{item.houseType}}
					</view>
					<view class="text-gray text-sm">
						<text class="cuIcon-right margin-right-xs">建筑面积</text> {{item.buildingArea}}
					</view>
				</view>
				<view class="action">
					<view class="">
						
					</view>
				</view>
			</view>
			
			<view class="cu-item" v-if="roomsFills.length === 0">
				<view class="content">
					<text class="cuIcon-warn text-green"></text>
					<text class="text-grey">暂无失败记录</text>
				</view>
				<view class="action">
			
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	// pages/my/myHouse.js
	import context from '../../lib/java110/Java110Context.js';
	const constant = context.constant;

	export default {
		data() {
			return {
				active: 0,
				rooms: "", // 绑定成功
				roomsFills:"", //绑定失败
				plotCommunityName:"", //小区名称
				communityId:'',
			};
		},

		components: {},
		props: {},

		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
			let _that = this;
			let userId = uni.getStorageSync("userInfo");
			let plotCommunity = uni.getStorageSync("_selectCommunity");
			_that.plotCommunityName = plotCommunity.communityName;
			_that.communityId = plotCommunity.id;
			
			
			
			_that.bindSucc();
			_that.loadFill();
		},

		/**
		 * 生命周期函数--监听页面初次渲染完成
		 */
		onReady: function() {},

		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {},

		/**
		 * 生命周期函数--监听页面隐藏
		 */
		onHide: function() {},

		/**
		 * 生命周期函数--监听页面卸载
		 */
		onUnload: function() {},

		/**
		 * 页面相关事件处理函数--监听用户下拉动作
		 */
		onPullDownRefresh: function() {
			this.loadOwnerHouse();
			uni.stopPullDownRefresh();
		},

		/**
		 * 页面上拉触底事件的处理函数
		 */
		onReachBottom: function() {},

		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage: function() {},
		methods: {
			// onChange: function(e) {

			// 	this._loadCompaint(e.detail.index);
			// },
			tabSelect: function(_active) {
				this.active = _active;
				// this._loadCompaint(_active);
				// this.noData = false;
			},
			/**
			 * 查看房屋绑定已通过记录
			 */
			bindSucc: function() {
				let userId = uni.getStorageSync("commonUser");
				this.userId = userId.id
				uni.request({
					url: constant.url.bindRecords,
					header: context.getHeaders(),
					method: "GET",
					data: {
						communityId:this.communityId,
						id:this.userId,
						type:1,
					},
					success:(res) => {
						this.rooms = res.data.result
						console.log("已通过",this.rooms)
					},
					fail: function(e) {
						wx.showToast({
							title: "服务器异常了",
							icon: 'none',
							duration: 2000
						});
					}
				});
			},
			
			/**
			 * 查看房屋绑定未通过记录
			 */
			loadFill: function() {
				let userId = uni.getStorageSync("commonUser");
				this.userId = userId.id
				uni.request({
					url: constant.url.bindRecords,
					header: context.getHeaders(),
					method: "GET",
					data: {
						communityId:this.communityId,
						id:this.userId,
						type:2,
					},
					success:(res) => {
						this.roomsFills = res.data.result
						console.log("未通过",this.roomsFills)
					},
					fail: function(e) {
						wx.showToast({
							title: "服务器异常了",
							icon: 'none',
							duration: 2000
						});
					}
				});
			}
		}
	};
</script>
<style scoped lang="scss">
	@import "@/pagesB/my/myHouse.css";

	/deep/ .cu-list.menu>.cu-item.arrow:before {
		content: none;
	}
</style>
